<template>
	<view class="sort">
		<navigator class="header" hover-class="none" url="/pages/goods_search/goods_search">
			<u-search bg-color="#F4F4F4" :disabled="true"></u-search>
		</navigator>
		<view class="content">
			<cate-one v-if="appConfig.cate_style == 2" :list="cateList"></cate-one>
			<cate-two v-if="appConfig.cate_style == 3" :list="cateList"></cate-two>
			<cate-three v-if="appConfig.cate_style == 4" :list="cateList"></cate-three>
			<cate-four v-if="appConfig.cate_style == 1" :list="cateList"></cate-four>
		</view>
		<!-- 客服 -->
	<!-- 	<view class="customer">
			<u-action-sheet :list="list" v-model="show">
				
			</u-action-sheet>
			
			<u-icon label="联系我们" label-size="18" label-color="#FC4A5B" label-pos="bottom" class="callPhone" @tap="tapPone" name="https://test.txjtapi.cn/uploads/images/kefu.png" color="#FC4A5B" size="50"></u-icon>
		</view> -->
		<!-- <a style="height: 80rpx;">15073024248</a> -->
		<view class="customer">
			<!-- <u-action-sheet :list="list" v-model="show">
				
			</u-action-sheet> -->
			<!-- <u-button @click="show = true">打开ActionSheet</u-button> -->
			<u-icon label="联系我们" label-size="18" label-color="#FC4A5B" label-pos="bottom" class="callPhone" @tap="tapJumpSalesman" name="https://test.txjtapi.cn/uploads/images/kefu.png" color="#FC4A5B" size="50"></u-icon>
		</view>
	</view>
</template>

<script>
	import {getService} from "@/api/app";
	import {
		getCatrgory
	} from '@/api/store';
	import {
		getRect,
		setTabbar
	} from '@/utils/tools';
	import {
		mapGetters,
		mapActions
	} from 'vuex'
	import Cache from '@/utils/cache'
	export default {
		data() {
			return {
				cateList: [],
				// 客服
				list: [{
					text: '微信客服',
					color: '#FC4A5B',
					
					
				}, {
					text: '电话联系',
					color: '#FC4A5B'
					
				}],
				show: false,
				phone:''
			};
		},

		components: {},
		onLoad(options) {
			setTabbar()
			this.getCatrgoryFun();
		},
		onShow() {
			this.getCartNum()
		},
		onShareAppMessage() {
			const shareInfo = Cache.get('shareInfo')
			return {
				title: shareInfo.mnp_share_title,
				path: "pages/sort/sort"
			};
		},
		methods: {
			...mapActions(['getCartNum']),
			async getCatrgoryFun() {
				await getCatrgory().then(res => {
					if (res.code == 1) {
						this.cateList = res.data
					}
				});
			},
			tapJumpSalesman(){
				uni.navigateTo({
					url: '/pages/bundle/salesman_info/salesman_info'
				});
			},
			// async tapPone(){
			// 	await getService().then(res => {
			// 	    if(res.code == 1) {
			// 	        this.phone = res.data.phone + ""
			// 	    }
			// 	})
			// 	console.log(this.phone,'我的手机号')
			// 	this.telphone(this.phone);
			// },
			// telphone(phone){
				
			// 	// 获取设备平台
			// 	let platform = uni.getSystemInfoSync().platform
			// 	// console.log(platform,"01")
			// 	// const _that = this;
			// 	switch (platform) {
			// 		case 'android':
			// 			uni.showActionSheet({
			// 			    itemList: [phone,'呼叫'],
			// 			    success:function(res){
			// 					// console.log(res,"02");
			// 					if(res.tapIndex==1){
			// 						plus.device.dial(phone,false)        
			// 					}
			// 			    },
			// 			    complete: function(res) {
			// 			       // console.log("安卓失败",res)
			// 			    }
			// 			})
			// 			break;
			// 		case 'ios':
			// 			// 使用uni-app提供的借口
			// 			uni.makePhoneCall({
			// 				phoneNumber: phone
			 
			// 			})
			// 			break;
			// 		// default:
			// 		// 调试器工具
			// 	}
			// }

		},
		computed: {
			...mapGetters(["cartNum", "inviteCode", "appConfig"])
		}
	};
</script>
<style lang="scss">
	$header-height: 94rpx;
	$nav-height: 80rpx;

	page {


		.sort {
			.header {
				box-sizing: border-box;
				height: $header-height;
				border-bottom: $-solid-border;

				.search {
					flex: 1;
					height: 60rpx;

					input {
						flex: 1;
						height: 100%;
					}
				}
			}

			.content {
				height: calc(100vh - #{$header-height} - var(--window-top) - var(--window-bottom));
			}
		}

	}
	
	.customer{
		position: absolute;
		right: 30rpx;
		bottom: 80rpx;
	}
	.callPhone{
		// display: block;
		  animation: rotate01 0.8s linear infinite;

	}
	@keyframes rotate01{
	  0%{
	    transform: rotateZ(0deg) ;/*从0度开始*/
	  }
	  25%{
	    transform: rotateZ(5deg) ;
	  }
	  50%{
	    transform: rotateZ(0deg) ;
	  }
	  75%{
	    transform: rotateZ(-5deg) scale(1.3);
	  }
	  100%{
	    transform: rotateZ(0deg) ;
	  }
	}

</style>